import React from 'react'
import { Link } from "react-router-dom"
import "../../assets/css/reset.css"
import "./index.css"
import { Switch, Route, Redirect } from "react-router-dom"
import home1 from "../../assets/img/home_unselected.png"
import cate1 from "../../assets/img/cate_unselected.png"
import shop1 from "../../assets/img/shop_unselected.png"
import user1 from "../../assets/img/user_unselected.png"
let Home = React.lazy(() => import("../home/Home"))
let List = React.lazy(() => import("../list/list"))
let Shop = React.lazy(() => import("../shop/shop"))
let Mine = React.lazy(() => import("../mine/mine"))


export default function index() {
    return (
        <div>
            <React.Suspense fallback={<div>请稍等下~~~~</div>}>
                <Switch>
                    <Route path="/index/home" component={Home}></Route>
                    <Route path="/index/list" component={List}></Route>
                    <Route path="/index/shop" component={Shop}></Route>
                    <Route path="/index/mine" component={Mine}></Route>
                    
                </Switch>
            </React.Suspense>               
                <div className="applist"style={{height:"1rem"}}>
                <div id="index" >
                    <div className="con">
                       
                            <Link to="/index/home">
                                <img src={home1} alt="" />
                                <div>商城</div>
                            </Link>
                            <Link to="/index/list">
                                <img src={cate1} alt="" />
                                <div>分类</div>
                            </Link>
                            <Link to="/index/shop">
                                <img src={shop1} alt="" />
                                <div>购物车</div>
                            </Link>
                            <Link to="/index/mine">
                                <img src={user1} alt="" />
                                <div>我的</div>
                            </Link>
                      
                    </div>
                    
                </div>
                </div>
            
        </div>
    )

}
